<template>
  <div class="g-container f-oh f-ptp10 f-pbt10">
    <div class='f-fl flex flex-wrap left'>
        <div class='flex flex-center flex-column menu-item mr35 mbt35'>
            <img src="../../assets/center_icon01.png" alt="">
            <p>在线咨询</p>
        </div>
        <div class='flex flex-center flex-column menu-item mr35 mbt35'>
            <img src="../../assets/center_icon02.png" alt="">
            <p>电话咨询</p>
        </div>
        <router-link to="/userCenter/entrustedCase" class='flex flex-center flex-column menu-item mbt35'>
            <img src="../../assets/center_icon03.png" alt="">
            <p>案件委托</p>
        </router-link>
        <div class='flex flex-center flex-column menu-item mr35'>
            <img src="../../assets/center_icon04.png" alt="">
            <p>提问题</p>
        </div>
        <div class='flex flex-center flex-column menu-item mr35'>
            <img src="../../assets/center_icon05.png" alt="">
            <p>法律知识</p>
        </div>
        <div class='flex flex-center flex-column menu-item'>
            <img src="../../assets/center_icon06.png" alt="">
            <p>1元公益计划</p>
        </div>
    </div>
    <div class='f-fr right'>
        <p>全国法律咨询热线</p>
        <div>
            <img src="" alt="">
            <p>400 - 800 - 8888</p>
        </div>
        <p>7*24小时第一时间响应</p>
        <p>提供法律咨询解答和找律师服务</p>
        <p>工作生活 有我无忧</p>
        <img src="" alt="">
        <p>扫一扫，关注公众号</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'UserCenterMenu',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.mr35{
    margin-right: 35px;
}
.mbt35{
    margin-bottom: 35px;
}
.left{
    width: 910px;
    height: 375px;
}
.right{
    width: 280px;
    height: 375px;
    background-color: #f0f0f0;
    border-radius: 2px;
}
.menu-item{
    width: 280px;
    height: 170px;
    border: 1px solid #f0f0f0;
    border-radius: 2px;
    text-align: center;
    box-sizing: border-box;
}
.menu-item>img{
    height: 40px;
    width: auto;
}
.menu-item>p{
    font-size: 14px;
    color: #666;
    margin-top: 10px;
}
</style>
